<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<div class="form-group">
    <button type="button" onclick="addNewOrganization();" class="btn btn-primary btn-sm">新增子部门</button>
    <button type="button" onclick="editNewOrganization();" class="btn btn-default btn-sm">编辑部门</button>

</div>
<input type="hidden" id="addOrEditId" value=""/>
<div id='jOrgChart'></div>
<style>
    a {
        text-decoration: none;
        color: #0C0C0C;
        font-size: 12px;
    }

    .jOrgChart .node {
        width: 120px;
        height: 50px;
        line-height: 50px;
        border-radius: 4px;
        margin: 0 8px;
        background-color: #84cdf7;
    }
</style>

<script type='text/javascript'>
    $(function () {
        tree();


    });

    function tree() {
        $("#jOrgChart").empty();
        //数据返回
        $.ajax({
            url: "<c:url value="/web/admin/organization/getOrganizationMsg.action"/>",
            type: 'GET',
            dataType: 'JSON',
            data: {id: ${organization.id}},
            success: function (result) {
                var data = result.data;
                var showlist = $("<ul id='org' style='display:none'></ul>");
                showall(data, showlist);
                $("#jOrgChart").append(showlist);
                $("#org").jOrgChart({
                    chartElement: '#jOrgChart',//指定在某个dom生成jorgchart
                    dragAndDrop: false //设置是否可拖动
                });
            }
        });

    }


    function showall(menu_list, parent) {
        $.each(menu_list, function (index, val) {
            if (val.childrens.length > 0) {

                var li = $("<li></li>");
                li.append("<a href='javascript:void(0)' id='" + val.id + "'>" + val.name + "</a>").append("<ul></ul>").appendTo(parent);
                //递归显示
                showall(val.childrens, $(li).children().eq(1));
            } else {
                $("<li></li>").append("<a href='javascript:void(0)'  id='" + val.id + "'>" + val.name + "</a>").appendTo(parent);
            }
        });

    }

</script>


<script>

    function closeView() {
        layer.close(LayWin['wOrganization']);
        $('#organizationGrid').dataGrid("refresh");
    }

    function onChoise(obj) {
        $("div.node").css("background", "#84cdf7");
        $(obj).css("background", "#84867f");
        $("#addOrEditId").val($(obj).children("a:eq(0)").prop("id"));
    }

    function addNewOrganization() {
        var id = $("#addOrEditId").val();
        if ($.trim(id) == "") {
            alert("请选择父级部门");
            return false;
        }
        vLayuiUtil.openLayerWindow('wAddChildOrganization', '<c:url
                        value="/web/admin/organization/addChildPage.action?parentId="/>' + id, '新增子部门')

    }

    function editNewOrganization() {
        var id = $("#addOrEditId").val();
        if ($.trim(id) == "") {
            alert("请选择要编辑的部门");
            return false;
        }
        vLayuiUtil.openLayerWindow('wAddChildOrganization', '<c:url
                        value="/web/admin/organization/addChildPage.action?id="/>' + id, '编辑部门')

    }
</script>


